<template>
  <el-dialog :title="dialog.title" :visible.sync="dialog.visible" top="5vh" width="70%">
    <el-table
      class="list-table"
      v-loading="listLoading"
      :data="historyList"
      stripe
      size="small"
      fit
      highlight-current-row
      style="width: 100%;">
      <!--  <el-table-column type="selection" width="55" align="center"/>-->
      <el-table-column label="审批单位" align="center" prop="auditDeptName" width="280"/>
      <el-table-column label="审批人" align="center" prop="auditerName" width="120"/>
      <el-table-column label="审批时间" align="center" prop="auditTime">
        <template slot-scope="scope">
          <span>{{ scope.row.auditTime | formatDate() }}</span>
        </template>
      </el-table-column>
      <el-table-column label="审批意见" align="center" prop="auditOpinion"/>
      <el-table-column label="审批结果" align="center" prop="auditResult">
        <template slot-scope="scope">
          <template v-if="scope.row.auditResult">
            <el-tag :type="scope.row.auditResult | auditResultStatusFilter" size="small">
              {{scope.row.auditResult |
              auditResultStatusFilter('text')}}
            </el-tag>
          </template>
        </template>
      </el-table-column>
    </el-table>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialog.visible = false">取消</el-button>
    </div>
  </el-dialog>
</template>

<script>
  import { historyList } from '@/api/hr/task'
  import filters from '@/filters/filters'
  import tagFilter from '@/filters/tagFilter'

  export default {
    name: 'todoHistory',
    mixins: [filters, tagFilter],
    components: {},
    data() {
      return {
        dialog: {
          visible: false, // 是否显示
          title: '审批历史记录查询'
        },
        listLoading: false,
        historyList: []
      }
    },
    props: {
      visible: {
        type: [Boolean],
        required: true,
        default: false
      },
      detailData: {
        type: Object,
        default() {
          return null
        }
      }
    },
    computed: {},
    methods: {
      async getListData() { // 获取列表数据
        try {
          this.listLoading = true
          let { detailData } = this
          let response = await historyList(detailData.infoId)
          this.historyList = response.data
        } catch (error) {
          // console.log(error)
        } finally {
          this.listLoading = false
        }
      },
      async initData() { // 初始化数据
        this.getListData()
      }
    },
    watch: {
      visible(newVal, oldVal) {
        if (newVal !== this.dialog.visible) {
          this.dialog.visible = newVal
          if (newVal) {
            this.initData()
          }
        }
      },
      'dialog.visible'(newVal, oldVal) {
        this.$emit('update:visible', newVal)
      }
    },
    created() {
    },
    mounted() {
    }
  }
</script>

<style lang="scss" scoped>

</style>
